{include file="public/head"/}

<div class="container-fluid" id="main">

    <input type="hidden" id="request" value="{$request}">

    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="alert alert-dismissable alert-info">
            <button type="button" class="close">×</button>
            <p></p>
            </div>
        </div>
    </div>
      
       
    <div class="ntDesktop">
		<div class="ntDesktop-head">{:lang("product_accessory_type")}</div>
        <div class="row clearfix" style="padding-top:0px">
            <div class="col-md-6 column">
                <ul class="nav nav-tabs">
                    <li class="active">
                        <a href="#home" data-toggle="tab" id="list-all" @click="changelang('zh')">{:lang('Chinese')}</a>
                    </li>
                    <li>
                        <a href="#home" data-toggle="tab" id="list-normal" @click="changelang('en')">{:lang('English')}</a>
                    </li>
                    <li>
                        <a href="#home" data-toggle="tab" id="list-pulloff" @click="changelang('pt')">{:lang('Portuguese')}</a>
                    </li>
                </ul>
            </div>
            <div class="col-md-6 column text-right">
                <div>
                    <a href="{:url('proitem/addopen',['request'=>'add'])}" class='btn btn-primary' data-toggle="modal" data-target="#itemtype_editModal">
                        <span class="glyphicon glyphicon-plus"></span> {:lang('add_accessory_type')}
                    </a>
                </div>
            </div>
		</div>
       
		<div class="row clearfix">
            <div class="col-md-12 column">
                <table class="table table-striped table-hover ntTable">
                        <colgroup>
                            <col width="100">
                          </colgroup>
                    <thead>
                        <tr>
                            <th style="text-align: center;">No.</th>
                            <th> {:lang('name')} </th>
                            <th> {:lang('product')} </th>
                            <th> {:lang('universal')} </th>
                            <th> {:lang('status')} </th>
                            <th style="text-align: center;"> {:lang('operate')} </th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr v-for="(item,index) in listdata" v-cloak>
                            <td align="center">{{item.id}}</td>
                            <td> {{item.content}} </td>
                            <td> {{item.pro}} </td>
                            <td> {{item.is_public_note}} </td>
                            <td> {{item.is_status}} </td>
                            <td class="text-right">
                                <div>
                                  <a :href="'/admin/proitem/editopen?id='+item.id+'&request=edit'" class='btn btn-sm btn-primary' data-toggle="modal" data-target="#itemtype_editModal"><span class="glyphicon glyphicon-pencil"></span> {:lang('edit')}</a>
                                  <a href="javascript:;" class='btn btn-sm btn-default option-hide' @click="changeStatus(item.id,3,'batchHide')" v-if="item.status!='3'"><span class="glyphicon glyphicon-eye-close"></span> {:lang("hide")}</a>
                                  <a href="javascript:;" class='btn btn-sm btn-default option-hide' @click="changeStatus(item.id,1,'batchRestore')" v-if="item.status!='1'"><span class="glyphicon glyphicon-eye-close"></span> {:lang('recovery')}</a>
                                  <a href="javascript:;" class='btn btn-sm btn-default option-del' @click="changeStatus(item.id,2,'batchDel')" v-if="item.status!='2'"><span class="glyphicon glyphicon-trash"></span> {:lang('delete')}</a>
                                <a href="javascript:;" class='btn btn-sm btn-danger option-clear' @click="changeStatus(item.id,9,'batchClear')" v-if="item.status=='2'"><span class="glyphicon glyphicon-fire"></span> {:lang('clear')}</a>
                                </div>
                            </td>
                        </tr>
                        <tr style="text-align: center;"  v-if="listdata.length==0">
                                <td colspan="6">{:lang('no_data')}</td>
                            </tr>
                    </tbody>
                </table>
                <ul class="pagination" id="pagination">
                </ul>
            </div>
		</div>
	</div>
</div>


<!--添加弹窗部分 开始-->


<div class="modal fade" id="itemtype_editModal" tabindex="-1" role="dialog" aria-labelledby="ntModalLabel" aria-hidden="true"  data-backdrop="static" data-keyboard="false">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<script type="text/javascript">
     $("#itemtype_editModal").on("hidden.bs.modal", function() {
        $(this).removeData("bs.modal");
        $(".modal-content").children().remove();
    });
</script>
<!--弹窗部分 结束-->
<script src="/static/Admin/js/proitem.js"></script>
{include file="public/foot"/}